<template>
  <view class="yue-container">
    <!-- 头部： -->
    <view class="header">
      <view class="count">{{userinfo.score}}</view>
      <view class="name">我的积分</view>
    </view>
    <view class="title">积分明细</view>
    <!-- 明细： -->
	<view class="flexcenter1" v-if="!list.data.length">
		<view class="placeholderimg" style="margin-top: 300rpx;">
			<image src="../../static/images/bg-icons/placeholderimg.png" mode=""></image>
		</view>
		<view class="zanwushuju">暂无数据~</view>
	</view>
    <view class="yue_list">
      <view class="yue_list_item" v-for="(item,index) in list.data" :key="item.id">
        <view class="line_one">
          <view class="word">{{item.memo}}</view>
          <text class="money">{{item.score}}</text>
        </view>
        <view class="line_two">{{item.createtime_text}}</view>
      </view>
    </view>
  </view>
</template>

<script>
const httpRequest = require("@/common/httpRequest.js")
  export default {
    data() {
      return {
        list:{
        	data:[]
        },
        limit:12,
        page:1,
		totalcent:'',
		
		userinfo:'',
      };
    },
    methods: {
      addMoney() {
        uni.navigateTo({
          url:'/pages/my/addMoney'
        })
      },
		getinfo(){
			httpRequest.request('api/user/index', 'GET', {
			},false,false,true).then(res => {
				this.userinfo = res.data
			})
		},
	  init(isPage, page) {
	  	let _this = this;
	  	httpRequest.request('api/user/getUserScoreLog', 'GET', {
	  		page: page || 1,
	  		limit: _this.limit,
	  	}, false, false, false).then(res => {
	  		if (res.code == 1) {
	  			let resList = res.data;
	  			let dataList = _this.list;
	  			if (isPage == true) {
	  				_this.list.data = dataList.data.concat(resList.data);
	  			} else {
	  				this.list = res.data
	  				_this.list.data = resList.data;
	  			}
	  		}
	  			
	  	}).catch(err => {
	  		httpRequest.toast(err.msg);
	  	})
	  },
	},
	onLoad(options) {
		this.init()
		this.getinfo()
		this.totalcent=options.cent
	},
	onReachBottom() {
		let _this = this;
		let list = _this.list;
		let page = _this.page;
		if (list.last_page <= page) {
			return false;
		}
		page++;
		_this.page = page;
		_this.init(true, page);
	},
  }
</script>

<style lang="scss" scoped>
  .yue-container {
	box-sizing: border-box;
    padding: 30rpx;
    background-color: #fafafa;
    min-height: 100vh
  }
  
  .header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 370rpx;
    background-image: url('/static/images/my/yue-head-bg.png');
    background-size: 100% 100%;
    overflow: hidden;
  }
  
  .count {
    margin-top: 76rpx;
    font-size: 80rpx;
    font-family: DIN Next LT Pro-Bold, DIN Next LT Pro;
    font-weight: bold;
    color: #FFFFFF;
  }
  
  .name {
    font-size: 36rpx;
    font-family: PingFang SC-Medium, PingFang SC;
    font-weight: 500;
    color: #FFFFFF;
    margin-top: 7rpx;
  }
  
  .title {
    font-size: 32rpx;
    font-family: PingFang SC-Heavy, PingFang SC;
    font-weight: 800;
    color: #000000;
    margin-top: 30rpx;
    background: url("/static/images/my/yuemx-bg.png") no-repeat;
    background-position: left bottom;
    background-size: 100%;
    box-sizing: border-box;
    display: inline-block;
  }
  
  .yue_list {
    background-color: #fff;
    margin-top: 30rpx;
    border-radius: 16rpx;
  }
  
  .yue_list_item {
    padding: 30rpx;
    border-bottom: 1rpx solid #fcfcfc;
  }
  
  .yue_list_item:last-child {
    border-bottom: none;
  }
  
  .line_one {
    display: flex;
    justify-content: space-between;
  }
  
  .word {
    font-size: 28rpx;
    font-family: PingFang SC-Heavy, PingFang SC;
    font-weight: 800;
    color: #333333;
  }
  
  .money {
    font-size: 32rpx;
    font-family: DIN Next LT Pro-Bold, DIN Next LT Pro;
    font-weight: bold;
    color: #00D2E1;
  }
  
  .line_two {
    margin-top: 11rpx;
    font-size: 24rpx;
    font-family: PingFang SC-Medium, PingFang SC;
    font-weight: 500;
    color: #999999;
  }
</style>
